import { useState, useEffect } from "react";
import { Form, Row, Col, Select } from "antd";
import { CommonModal } from "@/views/components/CommonModal";
import GoPay from "./goPay";
import { cashpaymentMethod } from "../service";
import SubTitle from "@/pages/OrderModule/common/components/SubTitle";
import styles from "./index.module.less";
const PurchaseOrderModal = ({ visible, query, checkedRows, checkedIds, fetchList, handleCancel, dataSource }) => {
	const [form] = Form.useForm();
	const [loading, setLoading] = useState(false);
	const [addVisible, addSetVisible] = useState(false); //去支付弹窗
	const [select, setSelectData] = useState(0); //loading
	const [goodsNum, setGoodsNum] = useState(0); //loading
	const [priceSum, setPriceSum] = useState(0); //loading
	const [cashpayment, setCashpayment] = useState(null); //loading
	const [suppierLen, setSuppierLen] = useState(null); //loading

	useEffect(() => {
		if (checkedRows.length > 0) {
			const filteredData = checkedRows.filter(item => item.hasOwnProperty("skuId"));
			const uniqueById = checkedRows.filter((item, index) => {
				return checkedRows.findIndex(otherItem => otherItem.supplierId === item.supplierId) === index;
			});
			setSuppierLen(uniqueById.length);
			const totalPriceSum = filteredData.reduce((sum, item) => sum + item.allPrice, 0);
			setGoodsNum(filteredData.length);
			const outboundProductIdsArray = filteredData.flatMap(item => item.outboundProductIds);
			setSelectData(filteredData);
			setPriceSum(totalPriceSum);
			cashpaymentMethodFn(outboundProductIdsArray);
		}

		if (visible) {
			form.resetFields();
		}
	}, [visible]);
	const cashpaymentMethodFn = async e => {
		const { data, success } = await cashpaymentMethod({ ids: e });
		if (success) {
			setCashpayment(data);
		}
	};
	const onOk = () => {
		addSetVisible(true);
	};
	const CheckStockAndNoteProps = {
		addVisible,
		query,
		priceSum,
		dataSource,
		fetchList,
		select,
		cashpayment,
		checkedIds,
		checkedRows,
		handleOk() {},
		// 支付关闭
		handleCancel() {
			onCancel(); //关闭当前页
			addSetVisible(0);
		}
	};
	const onCancel = () => {
		handleCancel();
		form.resetFields();
	};

	return (
		<CommonModal title={{ title: "快销采购单" }} visible={true} onOk={onOk} okText="去支付" onCancel={onCancel} minHeight="150px">
			<Form form={form} name="mark-unuaual-modal">
				<Row>
					<Col span={12}>
						<SubTitle symbol as="s2" title="订单详情" />
					</Col>
				</Row>
				<Row style={{ marginTop: 16, marginLeft: 12 }}>
					<Col span={8} style={{ marginBottom: "24px" }}>
						<div>供应商数量：{suppierLen}</div>
					</Col>
					<Col span={8}>
						<div>商品数量：{goodsNum}</div>
					</Col>
				</Row>
				<Row>
					<SubTitle symbol as="s2" title="支付详情" />
				</Row>
				<Row style={{ marginTop: 16, marginLeft: 12 }}>
					<Col span={8}>
						<div>
							采购总金额：<span className={styles.co2641}>￥{cashpayment ? cashpayment.totalAmount : 0}</span>
						</div>
					</Col>
					<Col span={8}>
						<div>
							账期应付：<span className={styles.co2641}>￥{cashpayment ? cashpayment.creditTotalAmount : 0}</span>
						</div>
					</Col>
					<Col span={8}>
						<div>
							余额应付：<span className={styles.co2641}>￥{cashpayment ? cashpayment.balanceTotalAmount : 0}</span>
						</div>
					</Col>
				</Row>
			</Form>
			{addVisible == true && <GoPay {...CheckStockAndNoteProps} />}
		</CommonModal>
	);
};

export default PurchaseOrderModal;
